<template>
  <div>
    <a-menu theme="dark" mode="inline"
      @click="handleClick">
      <template v-for="item in menuList">
        <a-menu-item v-if="!item.children" :key="item.key" :data="item">
          <span>{{ $t(item.title) }}</span>
        </a-menu-item>
        <sub-menu v-else :menu-info="item" :key="item.key"/>
      </template>
    </a-menu>
  </div>
</template>

<script>
/* 
 * recommend SubMenu.vue https://github.com/vueComponent/ant-design-vue/blob/master/components/menu/demo/SubMenu.vue
 * SubMenu1.vue https://github.com/vueComponent/ant-design-vue/blob/master/components/menu/demo/SubMenu1.vue
 * */
import axios from 'axios'
import common from '@/global/common.js'
import SubMenu from './SubMenu'
export default {
  components: {
    'sub-menu': SubMenu,
  },
  data () {
    return {
      menuList: [],
    }
  },
  mounted(){
    axios({
      method: 'get',
      url: '/infra/menu/getUserMenuList',
      param: {},
    }).then(response=>{
      this.menuList = response.data.rows;
    })

    this.$store.dispatch('loadVisibleFunc')
  },
  methods: {
    // 点击菜单
    handleClick (menuItem) {
      if (menuItem.item == undefined) {
        return; // 点击的父菜单
      }
      let menu = menuItem.item.attribute;

      let successCallback = function(){
        this.$emit('handle-click', menu); // 把点击事件传递到调用DefaultMenu的地方
      }.bind(this) // 修正this指向使用，bind(this)
      common.sessionCheck(menuItem.key, successCallback, null);
    },
  }
}
</script>
